<template>
	<div class="index">
    <div style="padding: 0rem 0rem; position: relative; background: #1989fa; height: 0.9rem;" class="flexcc">
    	<div style="position: absolute; left: 0.3rem; top: 0rem; height: 100%;" class="flexc"><van-icon name="arrow-left" size="0.3rem" style="font-weight: bold;" @click="back()" color="#fff" /></div>
    	<div style="color: #fff;  font-weight: bold;">公海客户</div>
    </div>
    <div style="padding: 0.3rem;">
      <div class="yy" v-for="(item,index) in list" :key="index" style="margin-bottom: 0.2rem;" @click="go('/kehu/xiangqing',item.id)">
        <div class="flexbc" style="border-bottom: 1px dashed #ddd;">
          <div style="font-weight: bold; margin-bottom: 0.2rem; font-size: 0.3rem;">{{item.khmc}}</div>
          <div><van-icon name="edit" color="#259b24" size="0.35rem" style=" font-weight: bold;" @click.stop="go2(item.id)" /></div>
        </div>

    		<div class="flex" style="padding-top: 0.2rem;">
    			<div style="flex: 1; overflow: hidden;">
    				<div style="color: #999; margin-bottom: 0.1rem;">跟进状态</div>
    				<div style="color: #666; margin-bottom: 0.2rem;">{{item.gjzt}}</div>
    				<div style="color: #999; margin-bottom: 0.1rem;">创建时间</div>
    				<div style="color: #666; font-size: 0.2rem;" >{{item.createtime}}</div>
    			</div>
    			<div style="flex: 1; overflow: hidden;">
    				<div style="color: #999; margin-bottom: 0.1rem;">客户类型</div>
    				<div style="color: #666; margin-bottom: 0.2rem;">{{item.khlx}}</div>
    				<div style="color: #999; margin-bottom: 0.1rem;">最近一次拜访</div>
    				<div style="color: #666; font-size: 0.2rem;">{{item.lasttime}}</div>
    			</div>
    			<div style="flex: 1; overflow: hidden;">
    				<div style="color: #999; margin-bottom: 0.1rem;">联系电话</div>
    				<div style="color: #666; margin-bottom: 0.2rem;">{{item.dh}}</div>
    				<div style="color: #999; margin-bottom: 0.1rem;">客户状态</div>
    				<div style="color: #259b24; " v-if="item.spzt == 0">已审批</div>
    				<div style="color: #1989fa; " v-if="item.spzt == 1">待审批</div>
    				<div style="color: #f00; " v-if="item.spzt == 2">不通过</div>
    			</div>
    		</div>
    	</div>

    	<div class="flexcc" @click="go2('')">
    		<div><van-icon name="add-o" size="0.35rem" style="  margin-right: 0.1rem;" /></div>
    		<div>点击添加公海客户</div>
    	</div>



    </div>

    <van-popup v-model="tuihuilog" position="center">
    	<div style="border: 1px #CCCCCC solid; padding: 0.2rem; width: 6rem;">
    		<div style="padding-bottom: 0.2rem; border-bottom: 1px #ccc solid; font-size: 0.3rem; text-align: center; font-weight: bold;">退回至公海客户</div>

    		<div style="padding: 0.3rem 0; color: #666;">
    			<div>是否确定将所选客户退回至公海客户？</div>
    			<div>转移成功后，此客户数据将属于公共资源，原负责人不能再维护跟进和更新此客户数据。</div>
    		</div>

    		<div class="flexcc">
    			<van-button type="default" size="small" style="margin-right: 0.6rem;">取消</van-button>
    			<van-button type="info" size="small" >确认</van-button>
    		</div>
    	</div>
    </van-popup>
    <van-popup v-model="shanchulog" position="center">
    	<div style="border: 1px #CCCCCC solid; padding: 0.2rem; width: 6rem;">
    		<div style="padding-bottom: 0.2rem; border-bottom: 1px #ccc solid; font-size: 0.3rem; text-align: center; font-weight: bold;">退回至公海客户</div>

    		<div style="padding: 0.3rem 0; color: #666;">
    			<div>是否确定将所选客户删除？</div>
    			<div>删除成功后，原负责人不能再维护跟进和更新此客户数据。</div>
    		</div>

    		<div class="flexcc">
    			<van-button type="default" size="small" style="margin-right: 0.6rem;">取消</van-button>
    			<van-button type="info" size="small" >确认</van-button>
    		</div>
    	</div>
    </van-popup>
	</div>
</template>

<script>
  var h = document.documentElement.clientWidth / 7.5 + 'px';
      document.documentElement.style.fontSize = h;
	export default {
		name: 'kehulist',
		data() {
			return {
        act:3,
        tuihuilog:false,
        shanchulog:false,
        list:[],
        all:{}
			}
		},
		created() {
      this.getlist()
		},
		mounted() {

		},
		methods: {
      go2:function(id){
        this.$router.push({
          path:'/kehu/xinjiankehu',
          query:{
            gonghai:true,
            id:id
          }
        })
      },
      getlist:function(){
        axios.get('/OpenCustomer/queryOpencustomerList',{params:this.all}).then((response)=>{
        	if (response.data.state == 200) {
            this.list = response.data.data
        	} else {
            vant.Toast(response.data.msg);
        	}
        })
      }

		}
	}
</script>


<style scoped >

    .yy {
      box-shadow: 0 0 0.1rem #eaeaea;
      padding: 0.2rem 0.3rem;
      margin-bottom: 0.3rem;
    }

    .act {
      background: #ccc !important;
      color: #FFFFFF;
      padding: 0.1rem 0.2rem;
      border-radius: 0.1rem;
    }

    .act1 {
      background: #fff;
      box-shadow: 0 0 0.1rem #eaeaea;
      padding: 0.1rem 0.2rem;
      margin-left: 0.2rem;
      border-radius: 0.1rem;
    }

</style>
